<template>
  <div style="margin:30px;margin-top:1px" class="container">
    <el-row >
      <el-col  :span="4">
        <el-button style="padding-left:50px;padding-right:50px;height:30px;line-height:0"  type="primary" @click="back" plain>返回</el-button>
      </el-col>
    </el-row>
    <h3 style="margin-top:30px">举报信息</h3>
    <el-row >
      <el-col :span="12">
        <el-row class="totality">
          <el-col  :span="8">
            <div class="l-top-50 grid-content bg-purple">机构名称</div>
          </el-col>
          <el-col :span="16">
            <div class="r-top-50-0 grid-content bg-purple">{{detailData.firmName || '暂无名称'}}</div>
          </el-col>
        </el-row>
        <el-row class="totality">
          <el-col :span="8">
            <div class="l-50 grid-content bg-purple">培训类型</div>
          </el-col>
          <el-col :span="16">
            <div class="r-50-0 grid-content bg-purple">{{detailData.trainingType || '暂无培训类型'}}</div>
          </el-col>
        </el-row>
        <el-row class="totality">
          <el-col :span="8">
            <div class="l-50 grid-content bg-purple">教师姓名</div>
          </el-col>
          <el-col :span="16">
            <div class="r-50-0 grid-content bg-purple">{{detailData.teacherName || '暂无教师姓名'}}</div>
          </el-col>
        </el-row>
      </el-col>
      <el-col :span="12">
        <el-row class="totality">
          <el-col :span="8">
            <div class="l-top-50 grid-content bg-purple">举报类型</div>
          </el-col>
          <el-col :span="16">
            <div class="r-top-50 grid-content bg-purple">{{detailData.complaintType || '暂无举报类型'}}</div>
          </el-col>
        </el-row>
        <el-row class="totality">
          <el-col :span="8">
            <div class="l-50 grid-content bg-purple">举报时间</div>
          </el-col>
          <el-col :span="16">
            <div class="r-50 grid-content bg-purple">{{detailData.createTime || '暂无举报时间'}}</div>
          </el-col>
        </el-row>
        <el-row class="totality">
          <el-col :span="8">
            <div class="l-50 grid-content bg-purple">所在班级</div>
          </el-col>
          <el-col :span="16">
            <div class="r-50 grid-content bg-purple">{{detailData.belongClass || '暂无班级'}}</div>
          </el-col>
        </el-row>
      </el-col>
      <el-row class="totality">
        <el-col  :span="4">
          <div class="l-50 grid-content bg-purple">举报标题</div>
        </el-col>
        <el-col :span="20">
          <div class="r-50 grid-content bg-purple">{{detailData.title || '暂无标题'}}</div>
        </el-col>
      </el-row>
    </el-row>

    <el-row class="totality" >
      <el-col  :span="4">
        <div class="l-150 grid-content bg-purple" >举报内容</div>
      </el-col>
      <el-col :span="20">
        <div  class="r-150 grid-content bg-purple">{{detailData.content || '暂无举报内容'}}</div>
      </el-col>
    </el-row>
    <el-row class="totality" style="height: 200px">
      <el-col  :span="4" style="height: 100%">
        <div class="grid-content bg-purple l-200" style="height: 100%">附件内容</div>
      </el-col>
      <el-col :span="20">
        <div class="grid-content bg-purple r-200 " style="border-bottom: 1px solid #e1e8ef;">
           <!-- 如果既有图片又有压缩包格式 -->
            <div v-if="informShow==2" style="display:flex;align-items:center">
              <div style="margin-top:10px;padding-left:10px;display:inline-block;display:flex;height:170px;">
                <el-image  v-for="(v,i) in informListData"  :key="i" style="margin-right:20px;padding-left:10px; padding-bottom:20px" :src="v.url" alt="" :preview-src-list="[v.url]"> </el-image>
              </div>
              <div  v-for="(item,index) in informListDataZip " :key="index" style="display:flex;margin-right:20px;display:inline-block;margin-left:10px">
                <img v-if="item.name==='.zip'" style="width:50px;height:50px;" src="../../assets/img/zip.png" alt="">
                <img v-if="item.name==='.doc' || item.name==='.docx'"  style="width:50px;height:50px;" src="../../assets/img/word.png" alt=""> 
                <img v-if="item.name==='.xls' || item.name==='.xlsx'" style="width:50px;height:50px;" src="../../assets/img/excel.png" alt="">
                <img v-if="item.name==='.pdf' || item.name==='.pptx'" style="width:50px;height:50px;" src="../../assets/img/ppt.png" alt="">
                <div class="down" @click="down(item.url)">
                  <span>下载</span>
                </div>
              </div>
            </div>
            <!-- 只有压缩包格式 -->
            <div v-if="informShow==1" style="display:inline-block;margin-top:10px;padding-left:10px">
              <div   v-for="(item,index) in informListDataZip " :key="index" style="display:flex;margin-right:20px">
                <img v-if="item.name==='.zip'" style="width:50px;height:50px;" src="../../assets/img/zip.png" alt="">
                <img v-if="item.name==='.doc' || item.name==='.docx'"  style="width:50px;height:50px;" src="../../assets/img/word.png" alt=""> 
                <img v-if="item.name==='.xls' || item.name==='.xlsx'" style="width:50px;height:50px;" src="../../assets/img/excel.png" alt="">
                <img v-if="item.name==='.pdf' || item.name==='.pptx'" style="width:50px;height:50px;" src="../../assets/img/ppt.png" alt="">
                <div class="down" @click="down(item.url)" style="padding-top:20px">
                  <span>下载</span>
                </div>
              </div>
            </div>
            <!-- 只有图片格式 -->
            <div  v-if="informShow==0" style="display:flex">
              <div  v-for="(item,index) in informListData " :key="index" style="width:170px;height:170px; display:flex;margin-right:20px;padding-left:10px;">
                <el-image class="elimg"  :src="item.url" alt="" :preview-src-list="[item.url]"> </el-image>
              </div>
            </div>
        </div>
      </el-col>
    </el-row>
    <el-row class="totality" style="height: 200px">
      <el-col  :span="4" style="height: 100%">
        <div class="grid-content bg-purple l-200" style="height: 100%">校外培训服务合同</div>
      </el-col>
      <el-col :span="20">
        <div class="grid-content bg-purple r-200 " style="border-bottom: 1px solid #e1e8ef;">
           <!-- 如果既有图片又有压缩包格式 -->
            <div v-if="protocolinformShow==2" style="display:flex;align-items:center" >
              <div style="margin-top:10px;padding-left:10px;display:inline-block;display:flex;height:170px;">
                <img v-for="(v,i) in informListProtocolData"  :key="i" style="margin-right:20px;padding-left:10px;" :src="v.url">
              </div>
              <div  v-for="(item,index) in informListProtocolDataZip " :key="index" style="display:flex;margin-right:20px;display:inline-block;margin-left:10px">
                <img v-if="item.name==='.zip'" style="width:50px;height:50px;" src="../../assets/img/zip.png" alt="">
                <img v-if="item.name==='.doc' || item.name==='.docx'"  style="width:50px;height:50px;" src="../../assets/img/word.png" alt=""> 
                <img v-if="item.name==='.xls' || item.name==='.xlsx'" style="width:50px;height:50px;" src="../../assets/img/excel.png" alt="">
                <img v-if="item.name==='.pdf' || item.name==='.pptx'" style="width:50px;height:50px;" src="../../assets/img/ppt.png" alt="">
                <div class="down" @click="down(item.url)">
                  <span>下载</span>
                </div>
              </div>
            </div>
            <!-- 只有压缩包格式 -->
            <div v-if="protocolinformShow==1" style="display:inline-block;margin-top:10px;padding-left:10px">
              <div   v-for="(item,index) in informListProtocolDataZip " :key="index" style="display:flex;margin-right:20px">
                <img v-if="item.name==='.zip'" style="width:50px;height:50px;" src="../../assets/img/zip.png" alt="">
                <img v-if="item.name==='.doc' || item.name==='.docx'"  style="width:50px;height:50px;" src="../../assets/img/word.png" alt=""> 
                <img v-if="item.name==='.xls' || item.name==='.xlsx'" style="width:50px;height:50px;" src="../../assets/img/excel.png" alt="">
                <img v-if="item.name==='.pdf' || item.name==='.pptx'" style="width:50px;height:50px;" src="../../assets/img/ppt.png" alt="">
                <div class="down" @click="down(item.url)" style="padding-top:20px">
                  <span>下载</span>
                </div>
              </div>
            </div>
            <!-- 只有图片格式 -->
            <div  v-if="protocolinformShow==0" style="display:flex">
              <div  v-for="(item,index) in informListProtocolData " :key="index" style="width:170px;height:170px;display:flex;margin-right:20px;padding-left:10px;">
                 <el-image    :src="item.url" alt="" :preview-src-list="[item.url]"> </el-image>
              </div>
            </div>
        </div>
      </el-col>
    </el-row>

    <h3 style="margin-top:30px"> 举报人信息</h3>

    <el-row >
      <el-col :span="12">
        <el-row class="totality">
          <el-col  :span="8">
            <div class="l-top-50 grid-content bg-purple">姓名</div>
          </el-col>
          <el-col :span="16">
            <div class="r-top-50 grid-content bg-purple">{{detailData.userName || '暂无姓名'}}</div>
          </el-col>
        </el-row>
        <el-row class="totality">
          <el-col :span="8">
            <div class="l-bottom-50 grid-content bg-purple">电话</div>
          </el-col>
          <el-col :span="16">
            <div class="r-bottom-50 grid-content bg-purple">{{detailData.userPhone || '暂无电话'}}</div>
          </el-col>
        </el-row>
      </el-col>
      <el-col :span="12">
        <el-row class="totality">
          <el-col :span="8">
            <div class="l-top-50 grid-content bg-purple">身份证号</div>
          </el-col>
          <el-col :span="16">
            <div  class="r-top-50 grid-content bg-purple">{{detailData.idCard || '暂无身份证'}}</div>
          </el-col>
        </el-row>
        <el-row class="totality">
          <el-col :span="8">
            <div class="l-bottom-50 grid-content bg-purple">邮箱</div>
          </el-col>
          <el-col :span="16">
            <div class="r-bottom-50 grid-content bg-purple">{{detailData.userEmail || '暂无邮箱'}}</div>
          </el-col>
        </el-row>
      </el-col>
    </el-row>

    <h3 style="margin-top:30px">核实信息</h3>

    <el-form v-if="this.$route.params.id === '0'" ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
      <el-form-item label="是否属实" prop="auditResult">
        <!-- <el-radio-group v-model="formData.field_shifoushushi" size="medium">
          <el-radio v-model="radio" v-for="(item, index) in field_shifoushushiOptions" :key="index" :label="item.value"
                    :disabled="item.disabled">{{item.label}}</el-radio>
        </el-radio-group> -->
        <el-radio-group v-model="detailData.auditResult">
          <el-radio :label="0">是</el-radio>
          <el-radio :label="1">否</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="核实建议" prop="field_heshi">
        <el-input @input="inputChange" v-model="formData.field_heshi" type="textarea" placeholder="请输入核实建议"
                  :autosize="{minRows: 4, maxRows: 4}" :style="{width: '100%'}"></el-input>
      </el-form-item>
    </el-form>

    <el-row v-if="this.$route.params.id === '1'||this.$route.params.id === '2'">
      <el-col :span="12">
        <el-row class="totality">
          <el-col  :span="8">
            <div class="l-top-50 grid-content bg-purple">是否属实</div>
          </el-col>
          <el-col :span="16">
            <div class="r-top-50-0 grid-content bg-purple">{{detailData.auditResult==0?'否':'是'}}</div>
          </el-col>
        </el-row>
      </el-col>
      <el-col :span="12">
        <el-row class="totality">
          <el-col :span="8">
            <div class="l-50 grid-content bg-purple">核实人</div>
          </el-col>
          <el-col :span="16">
            <div class="r-50 grid-content bg-purple">{{detailData.auditUser}}</div>
          </el-col>
        </el-row>
      </el-col>
    </el-row>
    <el-row v-if="this.$route.params.id === '1'||this.$route.params.id === '2'" class="totality">
      <el-col  :span="4">
        <div class="l-50 grid-content bg-purple">核实时间</div>
      </el-col>
      <el-col :span="20">
        <div class="r-bottom-50 grid-content bg-purple">{{detailData.auditTime || '暂无时间'}}</div>
      </el-col>
    </el-row>
    <el-row v-if="this.$route.params.id === '1'||this.$route.params.id === '2'" class="totality">
      <el-col  :span="4">
        <div class="l-bottom-150 grid-content bg-purple">核实建议</div>
      </el-col>
      <el-col :span="20">
        <div class="r-bottom-150 grid-content bg-purple">{{detailData.auditSuggest || '暂无建议'}}</div>
      </el-col>
    </el-row>
<h3 style="margin-top:30px">{{this.$route.params.id === '2'?"执法信息":""}}</h3>
<el-form v-if="this.$route.params.id === '2'" ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
      <el-row v-if="this.$route.params.id === '2'|| this.$route.params.id === 'Y'" class="totality">
        <el-col  :span="4">
          <div class="left-l grid-content bg-purple">执法单位</div>
        </el-col>
        <el-col :span="8">
          <div class="right-r grid-content bg-purple">{{detailData.lawCompany}}</div>
        </el-col><el-col  :span="4">
          <div class="left-l grid-content bg-purple">执法人</div>
        </el-col>
        <el-col :span="8">
          <div class="right-r grid-content bg-purple">{{detailData.lawPerson}}</div>
        </el-col>
      </el-row>

      <el-row v-if="this.$route.params.id === '2'" class="totality">
        <el-col  :span="4">
          <div class="left-l grid-content bg-purple">执法时间</div>
        </el-col>
        <el-col :span="20">
          <div class="right-r grid-content bg-purple">{{detailData.lawTime}}</div>
        </el-col>
      </el-row>

      <el-row v-if="this.$route.params.id === '2'" class="totality" style="height: 160px">
        <el-col  :span="4" style="height: 100%;">
          <div class="left-l grid-content bg-purple" style="height: 100%;">执法意见</div>
        </el-col>
        <el-col :span="20" style="height: 100%;">
          <div class="right-r grid-content bg-purple" style="height: 100%;">{{detailData.lawSuggest}}</div>
        </el-col>
      </el-row>

      <el-row class="totality" style="height: 200px">
        <el-col  :span="4" style="height: 100%">
          <div class="left-l grid-content bg-purple" style="height: 100%">执法附件</div>
        </el-col>
        <el-col :span="20">
          <div  class="grid-content bg-purple r-200 " style="border-bottom: 1px solid #e1e8ef;">
            <!-- 如果既有图片又有压缩包格式 -->
            <div v-if="layZipShow==2" >
              <div style="margin-top:10px;padding-left:10px;display:inline-block;width:170px;height:170px;">
                  <el-image  v-for="(v,i) in layListData"  :key="i" style="margin-right:20px;padding-left:10px; padding-bottom:20px" :src="v.url" alt="" :preview-src-list="[v.url]"> </el-image>
              </div>
              <div  v-for="(item,index) in layListDataZip " :key="index" style="display:flex;margin-right:20px;display:inline-block;margin-left:-250px">
                <img v-if="item.name==='.zip'" style="width:50px;height:50px;" src="../../assets/img/zip.png" alt="">
                <img v-if="item.name==='.doc' || item.name==='.docx'"  style="width:50px;height:50px;" src="../../assets/img/word.png" alt=""> 
                <img v-if="item.name==='.xls' || item.name==='.xlsx'" style="width:50px;height:50px;" src="../../assets/img/excel.png" alt="">
                <img v-if="item.name==='.pdf' || item.name==='.pptx'" style="width:50px;height:50px;" src="../../assets/img/ppt.png" alt="">
                <div class="down" @click="down(item.url)">
                  <span>下载</span>
                </div>
              </div>
            </div>
            <!-- 只有压缩包格式 -->
            <div v-if="layZipShow==1" style="display:inline-block;margin-top:10px;padding-left:10px">
              <div   v-for="(item,index) in layListDataZip " :key="index" style="display:flex;margin-right:20px">
                <img v-if="item.name==='.zip'" style="width:50px;height:50px;" src="../../assets/img/zip.png" alt="">
                <img v-if="item.name==='.doc' || item.name==='.docx'"  style="width:50px;height:50px;" src="../../assets/img/word.png" alt=""> 
                <img v-if="item.name==='.xls' || item.name==='.xlsx'" style="width:50px;height:50px;" src="../../assets/img/excel.png" alt="">
                <img v-if="item.name==='.pdf' || item.name==='.pptx'" style="width:50px;height:50px;" src="../../assets/img/ppt.png" alt="">
                <div class="down" @click="down(item.url)" style="padding-top:20px">
                  <span>下载</span>
                </div>
              </div>
            </div>
            <!-- 只有图片格式 -->
            <div  v-if="layZipShow==0">
              <div  v-for="(item,index) in layListData " :key="index" style="display:flex;margin-right:20px;padding-left:10px;width:170px;height:170px;">
                <el-image   :src="item.url" alt="" :preview-src-list="[item.url]"> </el-image>
              </div>
            </div>
          </div>
        </el-col>
      </el-row>
    </el-form>
    <el-row style="margin-top: 80px">
      <el-col  :span="10">
        <div>&nbsp;</div>
      </el-col>

      
      <el-col  :span="6">
        <el-button style="padding-left:50px;padding-right:50px;height:30px;line-height:0" v-if="this.$route.params.id === '0'"   type="primary" @click="open()">确定</el-button>
        <el-button  style="padding-left:50px;padding-right:50px;height:30px;line-height:0" type="primary" @click="$router.push({ name: 'inform' })" plain>返回</el-button>
      </el-col>
      <el-col :span="10">
        <div>&nbsp;</div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import * as api from "@/api/reportList/reportList.js"
  export default {
    data() {
      return {
        
        formData: {
          // 是否属实
          auditResult: '',
          // 核实建议
          field_heshi: '',
        },
        rules: {
          auditResult: [{
            required: true,
            message: '是否属实不能为空',
            trigger: 'blur'
          }],
          field_heshi: [{
            required: true,
            message: '请输入核实建议',
            trigger: 'blur'
          }],
        },
        field_shifoushushiOptions: [{
          "label": "是",
          "value": 1
        }, {
          "label": "否",
          "value": 0
        }],
        type: 'D',
        // 传递过来的详情数据
        detailData:{},
        // 是否属实
        radio:'',
        // 输入的建议内容
        auditSuggest:'',
        imgListData:[],
        // 传递过来的reportID获取详情
        reportId:'',
         layZipShow:0,
        // 执法附件都是图片列表
        layListData:[],
        // 执法附件都是压缩包列表
        layListDataZip:[],
          // 执法附件既有图片，也有压缩包列表
        allLayListDataImg:[],
        // 是否显示压缩包区域
        zipShow:0,
         // 附件内容图片列表
        informListData:[],
        // 附件内容压缩包列表
        informListDataZip:[],
         // 合同附件内容图片列表
        informListProtocolData:[],
        // 合同附件内容压缩包列表
        informListProtocolDataZip:[],
         // 显示图片还是其他格式附件
        informShow:0,
        lnformZipShow:0,
        // 负责下载的压缩包
        url:'',
         // 是否显示压缩包区域
        protocolinformShow:0,
        protocollnformZipShow:0,
        // 确定的请求参数
        // type: this.$route.params.type
      }
    },
    computed: {},
    created() {
      this.type = this.$route.params.id
      console.log('获取举报id',this.$route.params)
      // 获取举报详情
      this.getDetailData(this.reportId)
      
    },
      // 监听路由
    watch: {
      $route: {
        deep: true,
        immediate: true,
        handler(val) {
          console.log('获取过来的举报核实列表路由',val)
          if(val.params!=={}){
            this.reportId=this.$route.params.reportId
          }
        }
      }
    },
    methods: {
      back(){
        this.$router.push({ name: 'inform', params:{tabbar:this.type} })
      },
      // 输入的建议内容事件
      inputChange(event){
        this.formData.field_heshi=event
      },
      // 获取举报详情
      getDetailData(reportId){
        this.$http({
          url: this.$http.adornUrl('/info/reportDetails?reportId='+this.reportId
          ),
          method: 'post',
          data:{}
        }).then(res=>{
          console.log('获取举报详情的结果',res,res.data.code)
          if(res.data.code==0){
             this.detailData=res.data.data
            // 判断返回的附件内容是压缩包格式 还是普通图片格式。如果是图片格式。直接显示图片  如果是压缩包格式  显示压缩包图片，可以下载
            // 判断返回的附件内容是否是压缩包
               //  执法附件赋值
             this.getUrlChangeLayListData(res.data.data.lawUrlList)
            //  附件内容赋值
             this.getUrlChangeUrlListData(res.data.data.urlList)
             this.getProtocolUrlChangeUrlListData(res.data.data.protocolUrlList)
          }
        })
      },
       // 执法附件格式化
      getUrlChangeLayListData(url){
        if(url){
          console.log('执法附加转换的url',url)
          // 判断是否为json字符串在做解析
          if(url.indexOf("[")!= -1){
            console.log('执法附件走的json字符串')
            var img=JSON.parse(url)
            if(url.indexOf(".png")!= -1 && url.indexOf(".zip")!= -1){
              this.layZipShow=2
              img.forEach((item,index)=>{
                let type=img[index].substring(img[index].lastIndexOf('.')).toLowerCase()
                if(type=='.jpg' || type=='.jpeg' ||  type=='.png'){
                  let obj={
                    name:type,
                    url:img[index]
                  }
                  this.layListData.push(obj)
                }else {
                    let obj={
                    name:type,
                    url:img[index]
                  }
                  this.layListDataZip.push(obj)
                }
              })
            }else if(url.indexOf(".png")!= -1 || url.indexOf(".jpg")!= -1  || url.indexOf(".jpeg")!= -1 ){
              console.log('22222222',url)
              this.layZipShow=0
              img.forEach((item,index)=>{
                let type=img[index].substring(img[index].lastIndexOf('.')).toLowerCase()
                let obj={
                  name:type,
                  url:img[index]
                }
                this.layListData.push(obj)
              })
            }else {
              this.layZipShow=1
              let img=JSON.parse(url)
              img.forEach((item,index)=>{
                let type=img[index].substring(img[index].lastIndexOf('.')).toLowerCase()
                let obj={
                  name:type,
                  url:img[index]
                }
                this.layListDataZip.push(obj)
              })
            }
          }else {
            console.log('执法附件走的不是json字符串')
            // 如果不是json穿格式直接push到数组里
            let URL=url.split(',')
            URL.forEach((item,index)=>{
              let type=url.substring(url.lastIndexOf('.')).toLowerCase()
              if(type=='.jpg' || type=='.jpeg' || type=='.png'){
                this.layZipShow=0
                let obj={
                  name:type,
                  url:url
                }
                this.layListData.push(obj)
              }else {
                this.layZipShow=1
                let obj={
                  name:type,
                  url:url
                }
                this.layListDataZip.push(obj)
              }
            })
            console.log('最终肤质肤质',this.layListData)
          }
        }
      },

      // 附件内容格式化
      getUrlChangeUrlListData(url){
        if(url){
          console.log('需要转换的url',url)
          // 判断是否为json字符串在做解析
          if(url.indexOf("[")!= -1){
            console.log('走是否包含数组的1')
            var img=JSON.parse(url)
            if(url.indexOf(".png")!= -1 && url.indexOf(".zip")!= -1){
              console.log('11111111',url)
              this.informShow=2
              img.forEach((item,index)=>{
                let type=img[index].substring(img[index].lastIndexOf('.')).toLowerCase()
                if(type=='.jpg' || type=='.jpeg' ||  type=='.png'){
                  let obj={
                    name:type,
                    url:img[index]
                  }
                  this.informListData.push(obj)
                }else {
                    let obj={
                    name:type,
                    url:img[index]
                  }
                  this.informListDataZip.push(obj)
                }
              })
              console.log('都有',this.informListData,this.informListDataZip)
            }else if(url.indexOf(".png")!= -1 || url.indexOf(".jpg")!= -1  || url.indexOf(".jpeg")!= -1 ){
              console.log('22222222',url)
              this.informShow=0
              img.forEach((item,index)=>{
                let type=img[index].substring(img[index].lastIndexOf('.')).toLowerCase()
                let obj={
                  name:type,
                  url:img[index]
                }
                this.informListData.push(obj)
              })
              console.log('只有图片',this.informListData)
            }else {
              console.log('22222222',url)
              console.log('只有压缩包')
              this.informShow=1
              let img=JSON.parse(url)
              img.forEach((item,index)=>{
                let type=img[index].substring(img[index].lastIndexOf('.')).toLowerCase()
                let obj={
                  name:type,
                  url:img[index]
                }
                this.informListDataZip.push(obj)
              })
            }
          }else {
            console.log('走是否包含数组的2')
            // 如果不是json穿格式直接push到数组里
            let type=url.substring(url.lastIndexOf('.')).toLowerCase()
            console.log('type',type)
            if(type=='.jpg' || type=='.jpeg' || type=='.png'){
              this.informShow=0
              // 将字符串转换为数组
              let arr=url.split(',')
              console.log('arr',arr)
              arr.forEach(item=>{
                let obj={
                  name:type,
                  url:item
                }
                this.informListData.push(obj)
              })
              console.log('push',this.informListData)
            }else {
              this.informShow=1
              let obj={
                name:type,
                url:url
              }
                this.informListDataZip.push(obj)
            }
            console.log('不是json穿',url,this.informListData)
          }
        }
      },
      // 合同附件内容格式化
      getProtocolUrlChangeUrlListData(url){
        if(url){
          console.log('需要转换的url',url)
          // 判断是否为json字符串在做解析
          if(url.indexOf("[")!= -1){
            console.log('走是否包含数组的1')
            var img=JSON.parse(url)
            if(url.indexOf(".png")!= -1 && url.indexOf(".zip")!= -1){
              console.log('11111111',url)
              this.protocolinformShow=2
              img.forEach((item,index)=>{
                 let type=img[index].substring(img[index].lastIndexOf('.')).toLowerCase()
                if(type=='.jpg' || type=='.jpeg' ||  type=='.png'){
                  let obj={
                    name:type,
                    url:img[index]
                  }
                  this.informListProtocolData.push(obj)
                }else {
                    let obj={
                    name:type,
                    url:img[index]
                  }
                  this.informListProtocolDataZip.push(obj)
                }
              })
              console.log('都有',this.informListProtocolData,this.informListProtocolDataZip)
            }else if(url.indexOf(".png")!= -1 || url.indexOf(".jpg")!= -1  || url.indexOf(".jpeg")!= -1 ){
              console.log('22222222',url)
              this.protocolinformShow=0
              img.forEach((item,index)=>{
                let type=img[index].substring(img[index].lastIndexOf('.')).toLowerCase()
                let obj={
                  name:type,
                  url:img[index]
                }
                this.informListProtocolData.push(obj)
              })
              console.log('只有图片',this.informListProtocolData)
            }else {
              console.log('22222222',url)
              console.log('只有压缩包')
              this.protocolinformShow=1
              let img=JSON.parse(url)
              img.forEach((item,index)=>{
                let type=img[index].substring(img[index].lastIndexOf('.')).toLowerCase()
                let obj={
                  name:type,
                  url:img[index]
                }
                this.informListProtocolDataZip.push(obj)
              })
            }
          }else {
            console.log('走是否包含数组的2')
            // 如果不是json穿格式直接push到数组里
            let type=url.substring(url.lastIndexOf('.')).toLowerCase()
            console.log('type',type)
            if(type=='.jpg' || type=='.jpeg' || type=='.png'){
              this.protocolinformShow=0
              // 将字符串转换为数组
              let arr=url.split(',')
              console.log('arr',arr)
              arr.forEach(item=>{
                let obj={
                  name:type,
                  url:item
                }
                this.informListProtocolData.push(obj)
              })
              console.log('push',this.informListProtocolData)
            }else {
              this.protocolinformShow=1
              let obj={
                name:type,
                url:url
              }
                this.informListProtocolDataZip.push(obj)
            }
            console.log('不是json穿',url,this.informLisProtocoltData)
          }
        }
      },
      // 举报核实系统详情确定
      open() {
        console.log('确定求',this.detailData.reportId)
        if(this.formData.field_heshi){
          var _self=this
          this.$confirm('确定审核通过吗', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
            center: true
          }).then(() => {
            let params={
              reportId:_self.detailData.reportId,
              auditResult:_self.detailData.auditResult==0?1:0,
              auditSuggest:_self.formData.field_heshi
            }
            console.log('获取传递的数据',params)
            api.reportCheckConfirm(params).then(res=>{
              console.log('获取审核结果是',res)
              if(res.data.code==0){
                this.$message({
                  type: 'success',
                  message: res.data.msg
                });
                this.$router.push({ name: 'inform' ,query:{
                  status:1
                } })
              }else{
                this.$message({
                  type: 'info',
                  message: res.data.msg
                });
              }
            })
          }).catch(() => {
            this.$message({
              type: 'info',
              message: res.data.msg
            });
          });
        }else {
           this.$message({
            type: 'info',
            message: '请填写核实建议'
          });
        }

        // const imga = require("../../assets/img/审批完成2.png");
        // this.$alert('<strong><img style="width: 70%;margin-left: 15%;" src='+ imga +'><div style="text-align: center;">审核完成</div></strong>', '', {
        //   dangerouslyUseHTMLString: true
        // });
      },
      // 附件下载
      down() {
        window.open(this.url)
      },
      openText() {
        this.$alert('<textarea class="textarea_border" v-model="formData.field101" rows="15" cols="50" maxlength="500" @input="descInput" placeholder="请输入拒绝原因" ></textarea> <span class="numberV" style="position: absolute; right: 15px;bottom: 2px;">' + this.txtVal + '/500</span>', '原因', {
          dangerouslyUseHTMLString: true,
          cancelButtonClass: "el-confirm"
        });
      },
      field104BeforeUpload(file) {
        let isRightSize = file.size / 1024 / 1024 < 2
        if (!isRightSize) {
          this.$message.error('文件大小超过 2MB')
        }
        return isRightSize
      },
      descInput(){
        this.txtVal = this.formData.field_heshi.length;
      },
    }
  }
</script>
<style scoped lang="scss">
  .el-image{//覆盖原来图片的宽高。。让高度自适应
    /deep/ img{
      width: auto;
      height: auto;
      max-width: 170px;
      max-height: 170px;
      overflow: auto;
    }
  }
  .container{
    /deep/.el-form-item__label{
      text-align: left;
      margin-left: -10px;
    }
  }
  .right-r {
    padding: 13px 13px 13px 33px;
    border: 1px solid  #e1e8ef;
    border-left: 0px solid  #e1e8ef;
  }
  .left-l {
    padding: 13px 13px 13px 33px;
    background: #ecf4fb;
    border: 1px solid  #e1e8ef;

  }
  .el-form-item__label::before{
    content: "*";
    position: absolute;
    width: 30px;
    height: 30px;
    left: 65px;
    color: red;
  }
  .down{
    color: rgb(30, 15, 235);
    cursor: pointer;
    display: inline-block;
    align-items: center;
    padding-left: 10px;
  }
  .down>span:hover{
    border-bottom: 2px solid rgb(30, 15, 235);
  }
</style>
